<template>
    <page-container>
        <Project ref="projectRef" v-model="projectId" />
        <Builder ref="builderRef" v-model="projectId" />
        <Deployer ref="deployerRef" v-model="projectId" />

        <div style="margin-top:15px;"></div>
        <a-row :gutter="16">
            <a-col :span="12">
                <a-space>
                    <a-button @click="() => { router.go(-1) }">返回</a-button>
                    <a-button type="primary" @click="submitHandle">提交</a-button>
                </a-space>
            </a-col>
        </a-row>
        <div style="margin-bottom:15px;"></div>
    </page-container>
</template>
<script setup lang="ts">
import Project from "./Project.vue"
import Builder from "./Builder.vue"
import Deployer from "./Deployer.vue"
import { message } from "ant-design-vue";

const route = useRoute()
const router = useRouter()
const projectId = ref(0)


onBeforeMount(() => {
    projectId.value = Number(route.query.id)
})


const projectRef = ref<InstanceType<typeof Project>>();
const builderRef = ref<InstanceType<typeof Builder>>();
const deployerRef = ref<InstanceType<typeof Deployer>>();
const submitHandle = async () => {
    const projectRes = await projectRef.value?.submit()
    if (!projectRes?.OK) {
        return
    }
    projectId.value = projectRes.project_id   
    const builderRes = await builderRef.value?.submit()
    if (!builderRes) {
        return
    }
    const deployerRes = await deployerRef.value?.submit()
    if (!deployerRes) {
        return
    }
    message.success("保存成功")
}
</script>
